import 'package:flutter/material.dart';

class RowWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: new AppBar(
          title: new Text("Row"),
          leading: new BackButton(),
        ),
        body: ListView(
          children: <Widget>[
            new Row(
              /*
          * 主轴方向上的对齐方式，会对child的位置起作用
          start：将children放置在主轴的起点（默认）；
          center：将children放置在主轴的中心；
          end：将children放置在主轴的末尾；
          spaceAround：将主轴方向上的空白区域均分，使得children之间的空白区域相等，但是首尾child的空白区域为1/2；
          spaceBetween：将主轴方向上的空白区域均分，使得children之间的空白区域相等，首尾child都靠近首尾，没有间隙；
          spaceEvenly：将主轴方向上的空白区域均分，使得children之间的空白区域相等，包括首尾child；
           */
              mainAxisAlignment: MainAxisAlignment.start,
              /*
          * 在主轴方向占有空间的值
          max：根据传入的布局约束条件，最大化主轴方向的可用空间（默认）；
          min：与max相反，是最小化主轴方向的可用空间；
           */
              mainAxisSize: MainAxisSize.max,
              /*
          * children在交叉轴方向的对齐方式
          baseline：在交叉轴方向，使得children的baseline对齐；
          center：children在交叉轴上居中展示（默认）；
          end：children在交叉轴上末尾展示；
          start：children在交叉轴上起点处展示
          stretch：让children填满交叉轴方向；
           */
              crossAxisAlignment: CrossAxisAlignment.center,
              /*
          * children摆放顺序
          down：从top到bottom进行布局（默认)；
          up：从bottom到top进行布局。
           */
              verticalDirection: VerticalDirection.down,
              children: <Widget>[
                Expanded(
                  child: Container(
                    height: 100,
                    color: Colors.red,
                    padding: EdgeInsets.all(5),
                  ),
                  flex: 1,
                ),
                Expanded(
                  child: Container(
                    height: 100,
                    color: Colors.yellow,
                    padding: EdgeInsets.all(5),
                  ),
                  flex: 2,
                ),
                Expanded(
                  child: Container(
                    height: 100,
                    color: Colors.blue,
                    padding: EdgeInsets.all(5),
                  ),
                  flex: 1,
                ),
              ],
            ),
            new Row(
                mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  new Icon(Icons.star, color: Colors.green[500]),
                  new Icon(Icons.star, color: Colors.green[500]),
                  new Icon(Icons.star, color: Colors.green[500]),
                  new Icon(Icons.star, color: Colors.black),
                  new Icon(Icons.star, color: Colors.black),
                ]),
          ],
        ));
  }
}
